<html>
<head>
<script src="../../main/resources/net/pimpas/web/jsf/components/js/pimpas/pimpas.js"></script>
<script>
// detect
pimpas.RequireJS( 'detect.js' );
// listener
pimpas.RequireJS( 'listener.js' );
// log
pimpas.RequireJS( 'log.js' );
// timer
pimpas.RequireJS( 'timer.js' );
// interval
pimpas.RequireJS( 'interval.js' );
// dom
pimpas.RequireJS( 'dom.js' );
// dom event
pimpas.RequireJS( 'event.js' );
// httprequest
pimpas.RequireJS( 'httpRequest.js' );
// ajax
pimpas.RequireJS( 'ajax.js' );
// ajaxpopulate
pimpas.RequireJS( 'ajaxPopulate.js' );
// input
pimpas.RequireJS( 'populate/input.js' );
// select
pimpas.RequireJS( 'populate/select.js' );
// select
pimpas.RequireJS( 'populate/radio.js' );
// checkbox
pimpas.RequireJS( 'populate/checkbox.js' );
// html
pimpas.RequireJS( 'populate/html.js' );
// xml
pimpas.RequireJS( 'xml.js' );
// xpath
pimpas.RequireJS( 'xpath.js' );
// json
pimpas.RequireJS( 'json.js' );
// control
pimpas.RequireJS( 'control/ajaxControl.js');
// firebug
pimpas.RequireJS( 'firebug.js');
</script>
<style>
.containerLog {
	display: block;
	width: 250px;
	height: 300px;
	color: #0000CC;
	border: 1px solid black;
	float: right;
	overflow: auto;
}

.log {
}

.debug {
	color: #CCCCCC;
}

.info {
	color: #CCFF33;
}


.warn {
	color: #FF3366;
}


.fatal {
	color: red;
	font-weight: bold;
}


.error {
	color: #990000;
}


</style>
</head>
<body>
<script>
pimpas.FireBug.installLogInConsole(  );

pimpas.Log.TestGlobalListener = new pimpas.Listener();
pimpas.Extends(pimpas.Log.TestGlobalListener,
	{
		callBack: function(ref, obj) {
			var l0g = null;
			var el = null;
			var className = null;
			var div = null;
			var t = null;
			var h,m,s,ss;
			switch(obj.level) {
				case pimpas.Log.DEBUG:
				el = pimpas.DOM.getElement("logDebug");
				className = "debug";
				break;
				case pimpas.Log.INFO:
				el = pimpas.DOM.getElement("logInfo");
				className = "info";
				break;
				case pimpas.Log.WARNING:
				el = pimpas.DOM.getElement("logWarn");
				className = "warning";
				break;
				case pimpas.Log.ERROR:
				el = pimpas.DOM.getElement("logError");
				className = "error";
				break;
				case pimpas.Log.FATAL:
				el = pimpas.DOM.getElement("logFatal");
				className = "fatal";
				break;
			}
			
			div = pimpas.DOM.createElement("div", null);
			pimpas.DOM.addClassName(div, className);
			h = obj.time.getHours();
			m = obj.time.getMinutes();
			s = obj.time.getSeconds();
			t = pimpas.DOM.createTextNode("["+h+":"+m+":"+s+"] => "+obj.message);
			pimpas.DOM.add(div, t);
			pimpas.DOM.add(el, div);
		}
	}
);

pimpas.Log.addGlobalListener( pimpas.Log.TestGlobalListener );
var logDebug = new pimpas.Log();
var logInfo = new pimpas.Log();
var logWarn = new pimpas.Log();
var logError = new pimpas.Log();
var logFatal = new pimpas.Log();
</script>
<div class="containerLog">
<label for="logDebug">DEBUG:</label>
<div id="logDebug" class="log">
	
</div>
</div>
<div class="containerLog">
<label for="logInfo">INFO:</label>
<div id="logInfo" class="log">
	
</div>
</div>
<div class="containerLog">
<label for="logWarn">WARNING:</label>
<div id="logWarn" class="log">
	
</div>
</div>
<div class="containerLog">
<label for="logError">ERROR:</label>
<div id="logError" class="log">
	
</div>
</div>
<div class="containerLog">
<label for="logFatal">FATAL:</label>
<div id="logFatal" class="log">
	
</div>
</div>
<input type="button" name="" value="debug" onClick="logDebug.log(pimpas.Log.DEBUG, 'some log....');">
<input type="button" name="" value="info" onClick="logInfo.log(pimpas.Log.INFO, 'some log....');">
<input type="button" name="" value="warn" onClick="logWarn.log(pimpas.Log.WARNING, 'some log....');">
<input type="button" name="" value="error" onClick="logError.log(pimpas.Log.ERROR, 'some log....');">
<input type="button" name="" value="fatal" onClick="logFatal.log(pimpas.Log.FATAL, 'some log....');">
</body>
</html>